<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>工程树面板</title>
  <style>
      /*@import url(../css/html/layers/layers.css);*/
      /*@import url(../node_modules/element-ui/lib/theme-chalk/index.css);*/
      /*@import url(../js/plugin/ztreev3/css/bootstrapStyle/bootstrapStyle.css);*/
  </style>
    <script src="js/jquery-2.0.3.js"></script>
    <link href="css/layui.css" rel="stylesheet" />
    <script src="../configure/node_modules/loadsh/lodash.min.js"></script>
  <!--<script src="../../node_modules/loadsh/lodash.min.js"></script>-->
    <script src="js/jquery.ztree.all.min.js"></script>
  <!--<script src="../../node_modules/vue/dist/vue.js"></script>-->
   <script src="../configure/node_modules/vue/dist/vue.js"></script>
  <!--<script src="../../node_modules/element-ui/lib/index.js"></script>-->
   <script src="../configure/node_modules/element-ui/lib/index.js"></script>
    <script src="js/eventName.js"></script>
    <link href="css/layers.css" rel="stylesheet" />
  <!--<link rel="stylesheet" href="../../node_modules/element-ui/lib/theme-chalk/index.css"/>-->
     <link rel="stylesheet" href="../configure/node_modules/element-ui/lib/theme-chalk/index.css"/>
  <!--<link rel="stylesheet" href="../../js/plugin/ztreev3/css/bootstrapStyle/bootstrapStyle.css"/>-->
    <link href="css/ztreev3/css/bootstrapStyle/bootstrapStyle.css" rel="stylesheet" />
   <!--<link rel="stylesheet" href="../../node_modules/Scrollbar/jquery.mCustomScrollbar.css"/>-->
<link rel="stylesheet" href="../configure/node_modules/Scrollbar/jquery.mCustomScrollbar.css"/>
    <script src="js/eventEmitter.js"></script>

  <style>
      .node_name {
          color: #000000!important;
          font-weight: bold !important;
      }

      .ztree li span.button.chk.checkbox_true_part {
          background-position: -5px -48px!important;
      }
  </style>
</head>

<body>
  <div id="appTree" class="treePanel">
    <div id="newAndUpdateInput">
      <input style="background-color:#fff" type="text"  autocomplete="off"  class="layui-input" v-model="newAndUpdateInputValue">
<!--      <input value="" v-model="newAndUpdateInputValue" />-->
      <button type="button" class="layui-btn layui-btn-normal layui-btn-sm addgroupbtn" @click="m_addOrUpdate()">确定</button>
      <button type="button" class="layui-btn layui-btn-danger layui-btn-sm cancelgroupbtn" @click="m_cancel()">取消</button>
<!--      <el-button class="addgroupbtn" @click="m_addOrUpdate()">确定</el-button>-->
<!--      <el-button class="cancelgroupbtn" @click="m_addOrUpdate()">取消</el-button>-->
    </div>
    <div id="rMenu">
      <ul>
        <li id="m_fileinput" style="display: none"><input type="file" id="files" style="display: none"
            @change="fileInputExp"></li>
      <!--  <li id="m_addLocalLayers" @click="m_newLocalLayer">新建本地服务</li>
        <li id="m_addNetLayers" @click="m_newNetLayer">新建网络服务</li>-->
        <li id="m_addNetLayers" @click="m_newNetLayer">加载服务</li>
        <li id="m_addGroup" @click="m_addGroupPanel()">新建分组</li>
        <li id="m_updateName" @click="m_reaname()">重命名</li>
        <li id="m_addLocation" @click="m_newLocation()">新建兴趣点</li>
        <li id="m_del" @click="m_del()">删除</li>
        <li id="m_propery" @click="m_propery()">属性</li>
        <li id="m_legend" @click="m_legend()">图例</li>
        <li id="m_edit" @click="m_edit()">编辑</li>
        <li id="m_expot" @click="m_export()">导出工程树</li>
      </ul>
    </div>
    <ul id="treeDemo" class="ztree"></ul>
  </div>
  <!--<script src="../../node_modules/Scrollbar/jquery.mCustomScrollbar.js"></script>-->
<script src="../configure/node_modules/Scrollbar/jquery.mCustomScrollbar.js"></script>
  <!--<script src="../../js/Layers/layer.js"></script>-->
    <script src="js/layer.js"></script>
  <script>
      $(function () {
          $('#treeDemo').mCustomScrollbar({
              theme: "thick",
              scrollButtons: {
                  enable: false,
                  scrollType: "continuous",
                  scrollSpeed: 20,
                  scrollAmount: 40
              },
              horizontalScroll: false,
              scrollbarPosition: "outside",//滚动线的位置，在容器内部还是外部 inside(default)|outside (如果容器的position是static值，则添加position:relative)
              autoDraggerLength: true,//根据内容区域自动调整滚动条拖块的长度
              autoExpandScrollbar: true,
              advanced: {
                  updateOnContentResize: true,
              }
          });
      })
      function refreshNode(name) {
          /*根据 treeId 获取 zTree 对象*/
          var zTree = $.fn.zTree.getZTreeObj(name),
          type = "refresh",
          silent = false,
          /*获取 zTree 当前被选中的节点数据集合*/
          nodes = zTree.getSelectedNodes();
          /*强行异步加载父节点的子节点。[setting.async.enable = true 时有效]*/
          zTree.reAsyncChildNodes(nodes[0], type, silent);
      }
  </script>
</body>

</html>